<template>
  <view class="bg-white ss-r-20">
    <view class="ui-TC ss-font-34 ss-p-30 font-weight-b">{{ title }}</view>
		<slot></slot>
   <!-- <view class="grid">
      <view v-for="(item,index) in list" :key="index" class="grid-item" @tap.stop="onClick(item)">
        <view class="icon" :style="{background:item.bgColor}">
					<text class="iconfont " style="font-size: 45rpx;" :class="item.icon"></text>
        </view>
        <view class="ui-TC font-0 ss-m-t-6">
          {{ item.lable }}
        </view>
      </view>
    </view> -->
  </view>
</template>

<script setup>
import sheep from '@/sheep'

const props = defineProps({
  title: {
    type: String,
    default: '请选择表单'
  }
})


</script>

<style lang="scss" scoped>
.title{
	// color:#333;
	// color:￥--ui-TC;
}
.grid{
	padding-bottom: 10rpx;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	.grid-item{
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-top: 5rpx;
		padding-bottom: 35rpx;
		padding-left: 2rpx;
		padding-right: 2rpx;
		.icon{
			width: 88rpx;
			height: 88rpx;
			color:#fff;
			// background: linear-gradient(178deg, #4E76EC 0%, #9BADE3 100%);
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
}
.grid-item:active{
	opacity: 0.5;
}
</style>
